<template>
  <div>
    <!--  分类条件  -->
    <el-dialog
      v-dialogDrag
      :title="$t('market.accountSet')"
      model
      :visible.sync="isSubjectDialog"
      :close-on-click-modal="false"
      width="60%"
      center
      top="5vh"
      :before-close="confirmFal"
    >
      <div style="margin-bottom: 5px;">
        <el-button size="mini" @click="newly(1)">{{ $t('btn.newHang') }}<!--新增行--></el-button>
        <el-button size="mini" @click="newly(2)">{{ $t('btn.delHang') }}<!--删除行--></el-button>
      </div>
      <div>
        <jc-table
          :table-data="subjectData"
          :table-header="tableHeader"
          table-height="250px"
          serial
          @rowClick="rowClick"
        >
          <el-table-column :label="$t('market.impactFactor')" align="center">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fdescription"
                size="mini"
              >
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="desction(scope.$index, scope.row)"
                />
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.subjectValue')" align="center">
            <template slot-scope="scope">
              <el-input
                v-model="scope.row.fsubject"
                size="mini"
              >
                <i
                  slot="suffix"
                  class="el-input__icon el-icon-search"
                  @click="sujectOpen(scope.$index)"
                />
              </el-input>
            </template>
          </el-table-column>
          <el-table-column :label="$t('market.priority')" prop="fseq" align="center" />
          <el-table-column :label="$t('market.handle')" align="center" width="140px">
            <template slot-scope="scope">
              <el-button size="mini" @click="moveTop(scope.$index, scope.row)">上移</el-button>
              <el-button type="primary" size="mini" @click="moveBom(scope.$index, scope.row)">下移</el-button>
            </template>
          </el-table-column>
        </jc-table>
      </div>
      <h5 style="margin-bottom: 0">{{ $t('market.dimensionString') }}<!--核算维度--></h5>
      <div>
        <jc-table
          :table-data="dimensionData"
          :table-header="dimensionHeader"
          table-height="250px"
          serial
        >
          <!--  实际ID  -->
          <template v-slot:text2Slot="col">
            <el-input v-model="col.scope.row.fidfieldname" size="mini" />
          </template>
          <!--  实际名称字段  -->
          <template v-slot:text3Slot="col">
            <el-input v-model="col.scope.row.fnamefieldname" size="mini" />
          </template>
          <!--  字段  -->
          <template v-slot:text4Slot="col">
            <el-input v-model="col.scope.row.fdimensionrule" size="mini" />
          </template>
          <!--  操作  -->
          <template v-slot:btnSlot="col">
            <el-button type="danger" size="mini" @click="delDimen(col.scope.$index)">{{ $t('shop.delete') }}</el-button>
          </template>
        </jc-table>
      </div>
      <span>{{ $t('market.subjectCode') }}<!--科目编码：以[.] 号作为上下编码的依据。如： 1001.01 的上级科目是1001.--></span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="confirmFal">{{ $t('btn.cancel') }}</el-button>
        <el-button type="primary" @click="confirmConfig">{{ $t('btn.confirm') }}</el-button>
      </span>
    </el-dialog>
    <!--  分类条件  -->
    <classifyConfig
      v-if="isclassifyVisibled"
      :title="$t('market.sactorSet')"
      :fdesction="fdesction"
      :ftemp-id="ftempId"
      :msg="calssifySon"
      @classify="classifyData"
    />
    <!--  科目列表  -->
    <subjectList v-if="isSubListVisibled" @subject="sublistData" />
  </div>
</template>

<script>
import classifyConfig from '@/views/financial/voucherTemplate/components/classifyConfig'
import subjectList from '@/views/financial/voucherTemplate/components/subjectList'
import { querySubjectDetails } from '@/api/financial/subject'

export default {
  components: {
    classifyConfig,
    subjectList
  },
  props: {
    msg: {
      type: Array,
      default: function() {
        return []
      }
    },
    ftempId: { // 来源单据id
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      isSubjectDialog: true,
      isclassifyVisibled: false, // 科目影响
      isSubListVisibled: false, // 科目列表
      indexSelf: 0,
      fdesction: '',
      calssifySon: [],
      tableHeader: [],
      subjectData: [{
        fdescription: '',
        fsubjectId: '',
        fsubject: '',
        fseq: 1,
        entryDetailTerm: [],
        dimensionList: []
      }],
      dimensionData: [], // 核算维度
      dimensionHeader: [
        { label: 'ID', prop: 'fdimensionId', width: '80' },
        { label: this.$t('market.dimensionString'), prop: 'fname' },
        { label: this.$t('market.fidfieldname'), type: 'text2', prop: 'fidfieldname' },
        { label: this.$t('market.fnamefieldname'), type: 'text3', prop: 'fnamefieldname' },
        { label: this.$t('market.fdimensionrule'), type: 'text4', prop: 'fdimensionrule' },
        { label: this.$t('market.handle'), type: 'btn' }
      ],
      km: []
    }
  },
  watch: {
    msg: {
      handler(val) {
        if (val.length > 0) {
          this.subjectData = val
          this.dimensionData = this.subjectData[0].dimensionList
          this.priority()
        }
      },
      immediate: true
    }
  },
  methods: {
    aaaa(val) {
      console.log(val, 1)
    },
    // 打开
    desction(index, item) {
      this.calssifySon = item.entryDetailTerm
      this.fdesction = item.fdescription
      this.indexSelf = index
      this.isclassifyVisibled = true
    },
    // 影响因数
    classifyData(ev, en) {
      if (ev) {
        const item = this.subjectData[this.indexSelf]
        item.fdescription = ev
        item.entryDetailTerm = en
      }
      this.isclassifyVisibled = false
    },
    // 科目列表
    sujectOpen(index) {
      this.indexSelf = index
      this.isSubListVisibled = true
    },
    // 科目数据
    sublistData(item) {
      if (item.fsubjectId) {
        const ite = this.subjectData[this.indexSelf]
        ite.fsubjectId = item.fsubjectId
        ite.fsubject = item.fname
        this.dimenDetail(item.fsubjectId)
      }
      this.isSubListVisibled = false
    },
    // 获取科目详情
    dimenDetail(fid) {
      querySubjectDetails({ fid }).then(res => {
        if (res.code === 0 && res.data.dismensionList?.length > 0) {
          res.data.dismensionList.map(res => {
            res.fdimensionId = res.fid
            res.fidfieldname = res.idfieldname
            res.fdimensionrule = res.frule
            res.fnamefieldname = res.fieldname
          })
          this.dimensionData = res.data.dismensionList
          this.subjectData[this.indexSelf].dimensionList = res.data.dismensionList
        } else {
          this.dimensionData = []
          this.subjectData[this.indexSelf].dimensionList = []
        }
      })
    },
    // 确认
    confirmConfig() {
      this.km = []
      this.subjectData.forEach(res => {
        this.km.push(res.fsubject)
      })
      this.$emit('subject', this.subjectData, this.km)
    },
    // 取消
    confirmFal() {
      this.$emit('subject')
    },
    // 单击行
    rowClick(row, cloum) {
      this.dimensionData = row.dimensionList
      this.indexSelf = row.index
    },
    // 上移
    moveTop(index) {
      if (index === 0) return
      const ite = this.subjectData.splice(index, 1)
      this.subjectData.splice(index - 1, 0, ite[0])
      this.priority()
    },
    // 下移
    moveBom(index) {
      if (index + 1 === this.subjectData.length) return
      const ite = this.subjectData.splice(index, 1)
      this.subjectData.splice(index + 1, 0, ite[0])
      this.priority()
    },
    // 优先级
    priority() {
      this.subjectData.map((item, index) => {
        this.$nextTick(() => {
          item.fseq = index + 1
        })
      })
    },
    // 新增/删除行
    newly(ev) {
      const DATA = {
        fdescription: '',
        fsubjectId: '',
        fsubject: '',
        fseq: 1,
        entryDetailTerm: [],
        dimensionList: []
      }
      if (ev === 1) {
        this.subjectData.push(DATA)
      } else {
        this.subjectData.splice(this.indexSelf, 1)
      }
      this.priority()
    },
    // 删除核算维度
    delDimen(index) {
      this.subjectData[this.indexSelf].dimensionList.splice(index, 1)
    }
  }
}
</script>

<style scoped lang="scss">

</style>
